<!-- 资料提交审核中 -->
<template>
  <div class="">
    <div class="info">
      <span class="field-one">申请编号：{{ infoData.applicationNo }}</span>
      <span class="field-two">申请商户类型：标准商户</span>
      <span class="field-three">申请提交时间：{{ infoData.applyTime }}</span>
    </div>
    <div class="content">
      <div class="box-one disFlxJS">
        <div class="left">
          <span>当前进度：</span>
          <span class="status"
            >{{ applicationStatusEnum[infoData.applicationStatus]
            }}<span v-if="infoData.applicationStatus === 'REVIEW_BACK'" class="remark"
              >（{{ infoData.msg }}）</span
            ></span
          >
        </div>
        <div class="right">
          <div class="btn-one"><a @click="handleSelect(true)">查看资料</a></div>
          <div v-if="infoData.applicationStatus === 'REVIEW_BACK'" class="btn-two">
            <a @click="handleSelect(false)">修改资料</a>
          </div>
        </div>
      </div>
      <div class="disFlxJS _mt-10">
        <div>
          <div class="fz-16 fw-6">协议签署</div>
          <div class="fz-14">确认商户信息，在线签署协议</div>
        </div>
        <a-button type="primary" :disabled="infoData.applicationStatus !== 'AGREEMENT_SIGNING'" @click="handleToSign"
          >签署协议</a-button
        >
      </div>
    </div>
  </div>
</template>

<script>
import { SelectMerchantStatus, Repeat } from '@/api/finance/finance'
import { applicationStatusEnum } from '@/enums/system'
export default {
  components: {},
  data() {
    return {
      tenantId: undefined,
      infoData: {},
      applicationStatusEnum,
      current: 2
    }
  },
  computed: {},
  watch: {},
  methods: {
    handleSelect(disabled) {
      this.$emit('setCurrent', 0, disabled)
    },
    async getSelectMerchantStatus() {
      let res = await SelectMerchantStatus({ tenantId: this.tenantId })
      this.infoData = res.data || {}
    },
    async handleRepeat(verifyType) {
      let { code, msg } = await Repeat({ id: this.infoData.id, verifyType })
      this.$message[code === 0 ? 'success' : 'error'](msg)
    },
    handleToSign() {
      window.open(this.infoData.agreementSignUrl)
    }
  },
  created() {
    this.tenantId = this.$route.query.tenantId
    this.getSelectMerchantStatus()
  },
  mounted() {}
}
</script>
<style lang="less" scoped>
.info {
  font-size: 16px;
  font-weight: bold;
  margin: 30px 0;
  .field-two {
    margin: 0 30px;
  }
}
.content {
  padding: 20px;
  box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.1);
  border-radius: 20px;
  .box-one {
    .left {
      font-size: 18px;
      font-weight: bold;
      width: 80%;
      .status {
        color: red;
      }
      .remark {
        color: #999;
        font-size: 16px;
      }
    }
    .right {
      font-size: 16px;
      .btn-two {
        margin-top: 10px;
      }
    }
  }
  .box-two {
    padding: 20px;
    font-size: 16px;
    box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.1);
    border-radius: 20px;
    margin-top: 30px;

    .steps {
      margin-top: 30px;
      ::v-deep {
        .ant-steps-item-title {
          width: 100%;
        }
      }
      .step-title {
        display: flex;
        justify-content: space-between;
      }
    }
  }
}
</style>
